<template>
    <div class="bg">
        <el-row style="margin-top: 260px;z-index: 1;" width="30%">
      <el-col :offset="9" :span="6">
        <el-card class="login-box" v-loading="$store.state.loading" element-loading-background="rgba(0, 0, 0, 0.8)">
          <el-form >
            <h1 class="title"></h1>
            <p class="login-box-msg">您所在班级参加的是<span style="color:red">{{$store.state.examName}}</span>考试,时间为<span style="color:red">{{$store.state.examTime}}</span>分钟,请点击下方按钮进入考试</p>
            <el-button type="primary" @click="jump()" :loading="$store.state.loading" class="pull-right" style="width:60%;margin-left:80px">进入考试</el-button>
          </el-form>
        </el-card>
      </el-col>
    </el-row>
    </div>
</template>
<style>
.bg{
    background: url(../assets/ExamBg.jpg) no-repeat scroll center center / cover;
  background-size: 100% 100%;
  width: 100%;
  height: 100%;
  position: fixed;
}
.login-box {
    opacity:0.9;
  background: #ffffff;
  border: none;
}

.login-box-msg {
  color: #000000;
  text-align: center;
}

.login-box .title {
  color: #000000;
  text-align: center;
}
</style>
<script>
    export default {
        data() {
            return {
                isExamed:this.$store.state.isFinishedExam,
                examName:this.$store.state.examName,
                examTime:this.$store.state.examTime,
                role:this.$store.state.role
            }
        },
        mounted() {
        },
        methods: {
            jump(){
              if(this.isExamed == '1')
              {
                this.$notify({type:'warning',title:'提示',message:'系统检测到,您已经进行过这场考试'}) ;
              }else{
                if(this.role && this.role == '学生')
                {
                  this.$router.push({ path: "/Examinations" });
                }else{
                  this.$notify({type:'error',title:'错误',message:'管理员不能进行考试'}) ;
                }
                
              }
            }
        }
    }
</script>